<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0,maximum-scale=1.0,user-scalable=no">
    <meta name="apple-mobile-web-app-capable" content="yes" />
    <!--iPhone私有标签，它表示：允许全屏模式浏览-->
    <meta name="apple-mobile-web-app-status-bar-style" content="black" />
    <!--iPhone私有标签，它指定的iPhone中safari顶端的状态条的样式-->
    <meta name="format-detection" content="telephone=no; email=no" />
    <!--不识别邮件和不把数字识别为电话号码-->
    <link rel="stylesheet" href="./css/front-less/common.css" />
    <link rel="stylesheet" href="./css/front-less/personal-curse-m.css" />
    <link rel="stylesheet" href="./css/front-less/issue.css" />
    <link rel="stylesheet" href="./lib/bootstrap/css/bootstrap.min.css">
    <link rel="stylesheet" href="./lib/layui/css/layui.css">
    <script src="./node_modules/jquery/dist/jquery.js"></script>
    <title>wkt-发布</title>
</head>
<body>
<!--导航模块-->
<nav class="container-layout" id="public-header">
    <div class="content-layout" id="header-nav">
        <div class="logo-box">
            <a href="" class="logo">
                <img src="" alt="">
            </a>
            <div class="identity">
                我是教师
            </div>
            <div class="help-center">
                帮助中心
            </div>
        </div>
        <ul class="nav navbar-nav navbar-right">
            <li>
                <ul class="fun">
                    <li class="user-hint">
                        <a href="" class="icon icon-hint"></a>
                        <!--<div class="personal-hint">-->
                        <!--<ul>-->
                        <!--<li class="fun-list">-->
                        <!--<a href="javascript:;">我的主页</a>-->
                        <!--</li>-->
                        <!--<li class="fun-list">-->
                        <!--<a href="javascript:;">学习记录</a>-->
                        <!--</li>-->
                        <!--<li class="fun-list">-->
                        <!--<a href="javascript:;">退出登录</a>-->
                        <!--</li>-->
                        <!--</ul>-->
                        <!--</div>-->
                    </li>
                    <li><a href="" class="icon icon-msg"></a></li>
                </ul>
            </li>
            <!--<li class="user-lr">-->
            <!--<a href="" class="register">注册</a>-->
            <!--<span class="sep">|</span>-->
            <!--<a href="" class="login">登录</a>-->
            <!--</li>-->
            <li class="has-login">
                <a href="javascript:;" class="user-header-top">
                    <img src="" alt="">
                </a>
                <div class="personal-fun">
                    <ul>
                        <li class="fun-list">
                            <a href="javascript:;">我的主页</a>
                        </li>
                        <li class="fun-list">
                            <a href="javascript:;">学习记录</a>
                        </li>
                        <li class="fun-list">
                            <a href="javascript:;">退出登录</a>
                        </li>
                    </ul>
                </div>
            </li>
        </ul>

    </div>
</nav>
<!--主体部分-->
<div class="container-layout" id="container-main">
    <div class="content-layout">
        <h2 class="issue-title">发布作品</h2>
        <div class="issue-main">
            <form class="layui-form" action="">
                <div class="content-in-block">
                    <label class="task-title">请输入标题</label>
                    <input type="text" name="title" maxlength="50" placeholder="请输入标题" class="task-title-box">
                    <span class="num-length">0/50</span>
                </div>
                <div class="content-in-block">
                    <label class="task-title">所属圈子</label>
                    <input type="text" name="title" maxlength="50" placeholder="请输入标题" class="cate-choose" disabled>
                    <button type="button" class="cate-choose-btn layui-btn">点击选择</button>
                </div>
                <div class="content-in-block">
                    <label class="task-title">请上传封面</label>
                    <div class="z-file">
                        <button class="task-img-box" type="button" id="sola"></button>
                    </div>
                    <div class="hint-img">
                        <p class="hint-img-t">图片要求</p>
                        1.尺寸大于800*600分辨率小于96dpi大小小于2M<br>
                        2.支持jpg格式图片
                        3.该字段修改需审核，请确认后提交
                    </div>
                </div>
                <div class="content-in-block content-block">
                    <label class="task-title">编辑内容</label>
                    <textarea name="task-con" id="" class="task-con"></textarea>
                    <span class="num-length">0/300</span>
                </div>
                <div class="content-in-block">
                    <div class="z-file">
                        <input type="file" accept="image/*" placeholder="请输入文字说明" name="img" class="task-img-box">
                    </div>
                </div>
                <div class="content-in-block content-block">
                    <label class="task-title">附件上传</label>
                    <p class="file-name"></p>
                    <div class="up-file-btn" >
                        选择文件
                        <input type="file"  name="file" class="up_file" onchange=changeName(event)>
                    </div>
                </div>
                <div class="msg-fun-box">
                    <button type="button" class="layui-btn cancel-f-b">取消</button>
                    <button type="button" class="layui-btn post-f-b">发布</button>
                    <button type="button" class="layui-btn save-f-b">保存</button>
                </div>
            </form>
        </div>
    </div>
</div>
<!--遮罩层-->
<div id="issue-fun" class="issue-fun" style="display:none">
    <div class="full-shade"></div>
    <div class="choose-cate hide-style">
        <div class="hide-d-style">
            <h3 class="curse-title">领取成功</h3>
            <em class="layui-icon layui-icon-close"></em>
            <p class="del-hint">个人中心可查看我的优惠券</p>
            <a href="javascript:;" class="layui-btn sure-btn">确定</a>
        </div>
    </div>
    <div class="set-perfer">
        <h3 class="set-perfer-t">选择圈子</h3>
        <div class="perfer-cate blu">
            <p class="p-cate-title">IT</p>
            <ul class="perfer-list">
                <li class="perfer-item active">编程语言</li>
                <li class="perfer-item">编程语言</li>
                <li class="perfer-item">编程语言</li>
                <li class="perfer-item">编程语言</li>
                <li class="perfer-item">编程语言</li>
                <li class="perfer-item">编程语言</li>
            </ul>
        </div>
        <div class="perfer-cate yel">
            <p class="p-cate-title">设计</p>
            <ul class="perfer-list">
                <li class="perfer-item active">编程语言</li>
                <li class="perfer-item">编程语言</li>
                <li class="perfer-item">编程语言</li>
                <li class="perfer-item">编程语言</li>
                <li class="perfer-item">编程语言</li>
                <li class="perfer-item">编程语言</li>
            </ul>
        </div>
        <div class="perfer-cate gre">
            <p class="p-cate-title">互联网产品与运营</p>
            <ul class="perfer-list">
                <li class="perfer-item active">编程语言</li>
                <li class="perfer-item">编程语言</li>
                <li class="perfer-item">编程语言</li>
                <li class="perfer-item">编程语言</li>
                <li class="perfer-item">编程语言</li>
                <li class="perfer-item">编程语言</li>
            </ul>
        </div>
        <div class="perfer-cate red">
            <p class="p-cate-title">人工智能</p>
            <ul class="perfer-list">
                <li class="perfer-item active">编程语言</li>
                <li class="perfer-item">ui设计</li>
                <li class="perfer-item">编程语言</li>
                <li class="perfer-item">编程语言</li>
                <li class="perfer-item">编程语言</li>
                <li class="perfer-item">编程语言</li>
            </ul>
        </div>
        <a href="javascript:;" class="save-perfer layui-btn">保存</a>
    </div>
</div>
<script src="./js/assets/less.min.js"></script>
<script src="./lib/layui/layui.js"></script>
<script src="./js/front-js/common.js"></script>
<script src="./js/front-js/issue.js"></script>
</body>
</html>